<template>
  <am-button
    @click="trigger"
    customClass="dg-hide-741-up dg-toggle-style dg-toggle-pos"
    size="xl">
    <am-icon type="bars"></am-icon>
  </am-button>
</template>

<script>
export default {
  name: 'dg-toggle',
  data() {
    return {

    }
  },
  computed: {
    /**
     * 此函数来自amaze-vue
     */
    collapse() {
      let parent = this.$parent;
      while (parent) {
        if (parent.$options.name === 'dg-topbar') {
          break;
        } else {
          parent = parent.$parent;
        }
      }

      const findNode = childNodes => {
        let node = null;

        childNodes.every(vNode => {
          if (vNode.$options.name === 'dg-collapse') {
            node = vNode;
            return false;
          }

          if (vNode.$children) {
            node = findNode(vNode.$children);
          }
          return !node;
        });
        return node;
      }

      return findNode(parent.$children);
    }
  },
  methods: {
    trigger() {
      if (this.collapse) {
        this.collapse.autoFold();
      }
    }
  }
}
</script>

<style>
</style>